<!--
 * @Author: zxh
 * @Email: 1271027008@qq.com
 * @Date: 2020-02-24 08:53:29
 * @Descripttion: 多发/多收
 -->

<div class="manysendrecive_list">
    <div nz-row nzGutter="5" class="row_3">
        <div nz-col nzSpan="6">
            <label class="left_label">出入库日期：</label>
            <nz-range-picker nzDropdownClassName="date-range" class="dateSelect" ngModel (ngModelChange)="onDateChange($event)"></nz-range-picker>
        </div>
        <div nz-col nzSpan="3">
            <input appHotSearch (hotSearchEmit)="getRecordList('search')" nz-input placeholder="请输入账户别名"
                [(ngModel)]="accountName" />
        </div>
        <div nz-col nzSpan="3">
            <input appHotSearch (hotSearchEmit)="getRecordList('search')" nz-input placeholder="请输入工作令"
                [(ngModel)]="workOrder" />
        </div>
        <div nz-col nzSpan="6">
            <label>库房库区：</label>
            <nz-select nzDropdownClassName="select_custom" [(ngModel)]="kfId" class="selecta" (ngModelChange)="selectedkf($event)">
                <nz-option nzValue="" nzLabel="-请选择-"></nz-option>
                <nz-option *ngFor="let item of kfList" [nzValue]="item.id" [nzLabel]="item.name"></nz-option>
            </nz-select>
            <span> - </span>
            <nz-select nzDropdownClassName="select_custom" [(ngModel)]="kqId" class="selecta" (ngModelChange)="selectedkq($event)">
                <nz-option nzValue="" nzLabel="-请选择-"></nz-option>
                <nz-option *ngFor="let item of kqList" [nzValue]="item.id" [nzLabel]="item.name"></nz-option>
            </nz-select>
        </div>
        <div nz-col nzSpan="4">
            <label>物料编码：</label>
            <nz-select nzDropdownClassName="select_custom" [(ngModel)]="materialCode" class="selectb" (ngModelChange)="selectedwl($event)">
                <nz-option nzValue="" nzLabel="-请选择-"></nz-option>
                <nz-option *ngFor="let item of wlList" [nzValue]="item.materialCode" [nzLabel]="item.materialCode">
                </nz-option>
            </nz-select>
        </div>
        <div nz-col nzSpan="2">
            <input nz-input placeholder="物料名称" [(ngModel)]="materialName" readonly />
        </div>
    </div>
    <div nz-row nzGutter="16" class="row_3">
        <div nz-col nzSpan="8">
            <button *ngIf="power.addDF" nz-button nzType="primary" (click)="showModal(1)">多发</button>
            <button *ngIf="power.addDS" nz-button nzType="primary" (click)="showModal(2)">多收</button>
            <!-- <button *ngIf="power.del" nz-button nzType="primary" [disabled]="numberOfChecked==0" (click)="deleteMany()"
            [class]="numberOfChecked==0?'ant-btn ant-btn-primary defaultDeleteBg disabledBg':'ant-btn ant-btn-primary defaultDeleteBg'">删除</button>
        <button *ngIf="power.edit" nz-button nzType="primary" [disabled]="numberOfChecked!==1"
            (click)="editManyAdjust()"
            [class]="numberOfChecked!==1?'ant-btn ant-btn-primary defaultEditBg disabledBg':'ant-btn ant-btn-primary defaultEditBg'">保存
        </button> -->
            <!-- <button nz-button nzType="primary">确认调整</button> -->
            <button *ngIf="power.confirm" nz-button nzType="primary" [disabled]="numberOfChecked==0"
                (click)="goERPAdjust()"
                [class]="numberOfChecked==0?'ant-btn ant-btn-primary defaultERP disabledBg':'ant-btn ant-btn-primary defaultERP'">触发ERP</button>
        </div>
    </div>
    <div nz-row class="table_row">
        <nz-table #basicTable [nzData]="listData" [nzFrontPagination]="false"
            (nzCurrentPageDataChange)="currentPageDataChange($event)" [nzBordered]="true" nzSize="small" >
            <thead>
                <tr>
                    <th nzShowCheckbox [(nzChecked)]="isAllDisplayDataChecked" [nzIndeterminate]="isIndeterminate"
                        (nzCheckedChange)="checkAll($event)"></th>
                    <th>业务类型</th>
                    <th>物料编码</th>
                    <th>物料名称</th>
                    <th>库房</th>
                    <th>库区</th>
                    <th>出入库数量</th>
                    <th>总调整数</th>
                    <th>事务处理</th>
                    <th>条码批次</th>
                    <th>批次现有量</th>
                    <th>库存现有量</th>
                    <th>调整数</th>
                    <th>备注</th>
                </tr>
            </thead>
            <tbody>
                <tr *ngFor="let data of basicTable.data">
                    <td nzShowCheckbox [(nzChecked)]="mapOfCheckedId[data.id]" (nzCheckedChange)="refreshStatus()"></td>
                    <td>{{ data.typeStr }}</td>
                    <td>{{ data.materialCode }}</td>
                    <td>{{ data.materialName }}</td>
                    <td>{{ data.warehouseName }}</td>
                    <td>{{ data.warehouseAreaName }}</td>
                    <td>{{ data.amount }}</td>
                    <td>{{ data.reserveCount }}</td>
                    <td>{{ data.accountAliasStr }}</td>
                    <td>{{ data.stockBatch }}</td>
                    <td>{{ data.count }}</td>
                    <td>{{ data.stockAmount }}</td>
                    <td>
                        <span>{{ data.reserveNum }}</span>
                        <!-- <input class="selecta" *ngIf="newIdList.includes(data.id)" nz-input type="text"
                            [(ngModel)]="data.reserveNum" /> -->
                    </td>
                    <td>
                        <span>{{ data.commandStr }}</span>
                        <!-- <nz-select *ngIf="newIdList.includes(data.id)" [(ngModel)]="data.commandId" class="selecta"
                            (ngModelChange)="selectedGZLModal($event)">
                            <nz-option nzValue="" nzLabel="-请选择-"></nz-option>
                            <nz-option *ngFor="let item of markList" [nzValue]="item.id" [nzLabel]="item.remarks">
                            </nz-option>
                        </nz-select> -->
                    </td>
                </tr>
            </tbody>
        </nz-table>
        <div nz-row class="row_4">
            <nz-pagination [(nzPageSize)]="pageSize" [(nzPageIndex)]="pageIndex" [nzTotal]="totalSize"
                [nzShowTotal]="totalTemplate" (nzPageIndexChange)="clickPage($event)"></nz-pagination>
            <ng-template #totalTemplate let-total> 总共 {{ totalSize }} 条 </ng-template>
        </div>
    </div>
</div>
<div id="modal_box"></div>
<nz-modal appDragModal [nzStyle]="{left:'23%',top:'18%'}" nzMaskClosable="false" [nzGetContainer]="modalDomBox" class="modal_DFDS" [(nzVisible)]="isShowModal" [nzTitle]="modalType==1?'多发':'多收'"
    (nzOnCancel)="handleCancel()" nzWidth="70%" [nzFooter]="null">
    <div style="max-height: 500px;overflow-y: auto;overflow-x: hidden;">
        <div nz-row nzGutter="16" class="row_1">
            <div nz-col nzSpan="7">
                <label>库房库区：</label>
                <nz-select nzDropdownClassName="select_custom" [(ngModel)]="kfIdModal" class="selecta" (ngModelChange)="selectedkfModal($event)">
                    <nz-option nzValue="" nzLabel="-请选择-"></nz-option>
                    <nz-option *ngFor="let item of kfList" [nzValue]="item.id" [nzLabel]="item.name"></nz-option>
                </nz-select>
                <span> - </span>
                <nz-select nzDropdownClassName="select_custom" [(ngModel)]="kqIdModal" class="selecta" (ngModelChange)="selectedkqModal($event)">
                    <nz-option nzValue="" nzLabel="-请选择-"></nz-option>
                    <nz-option *ngFor="let item of kqListModal" [nzValue]="item.id" [nzLabel]="item.name"></nz-option>
                </nz-select>
            </div>
            <div nz-col nzSpan="6">
                <label>物料编码：</label>
                <nz-select nzDropdownClassName="select_custom" [(ngModel)]="materialCodeModal" class="selectb" (ngModelChange)="selectedwlModal($event)">
                    <nz-option nzValue="" nzLabel="-请选择-"></nz-option>
                    <nz-option *ngFor="let item of wlList" [nzValue]="item.materialCode" [nzLabel]="item.materialCode">
                    </nz-option>
                </nz-select>
            </div>
            <div nz-col nzSpan="3">
                <input nz-input placeholder="物料名称" [(ngModel)]="materialNameModal" readonly />
            </div>
            <div nz-col nzSpan="7">
                <label class="left_label">出入库日期：</label>
                <nz-range-picker nzDropdownClassName="date-range" class="dateSelect" ngModel (ngModelChange)="onDateChangeModal($event)">
                </nz-range-picker>
            </div>
        </div>
        <div nz-row class="modal_table_1">
            <nz-table [nzBordered]="true" nzTitle="出入库记录" #basicTableTop [nzData]="modalTable"
                [nzFrontPagination]="false" nzSize="small" >
                <thead>
                    <tr>
                        <th>业务类型</th>
                        <th>物料编码</th>
                        <th>物料名称</th>
                        <th>库房</th>
                        <th>库区</th>
                        <th>出入库数量</th>
                        <th>总调整数</th>
                        <th>事务处理</th>
                        <th>备注</th>
                        <!-- <th>操作</th> -->
                    </tr>
                </thead>
                <tbody>
                    <tr *ngFor="let data of basicTableTop.data" (click)="showDetail(data.id)"
                        [class]="selectedDetail==data.id?'ant-table-row ng-star-inserted active':'ant-table-row ng-star-inserted'">
                        <td>{{ data.bizTypeName }}</td>
                        <td>{{ data.materialCode }}</td>
                        <td>{{ data.materialName }}</td>
                        <td>{{ data.warehouseName }}</td>
                        <td>{{ data.warehouseAreaName }}</td>
                        <td>{{ data.amount }}</td>
                        <!--暂无-->
                        <td>
                            <!-- <span *ngIf="!data.isEdit">{{ data.reserveNumModal }}</span> -->
                            <input *ngIf="data.isEdit" nz-input [(ngModel)]="reserveNumModal" />
                        </td>
                        <td>
                            <!-- <span *ngIf="!data.isEdit">{{ data.BMIdModal }}</span> -->
                            <nz-select nzDropdownClassName="select_custom" *ngIf="data.isEdit" [(ngModel)]="BMIdModal" class="selecta"
                                (ngModelChange)="selectedBMModal($event,data.id)">
                                <nz-option nzValue="" nzLabel="-请选择-"></nz-option>
                                <nz-option *ngFor="let item of BMList" [nzValue]="item.id" [nzLabel]="item.alias">
                                </nz-option>
                            </nz-select>
                        </td>
                        <td>
                            <nz-select *ngIf="data.isEdit" nzDropdownClassName="select_custom" [(ngModel)]="commandStrModal" class="selecta"
                                (ngModelChange)="selectedGZLModal($event)">
                                <nz-option nzValue="" nzLabel="-请选择-"></nz-option>
                                <nz-option *ngFor="let item of markList" [nzValue]="item.id" [nzLabel]="item.content">
                                </nz-option>
                            </nz-select>
                        </td>
                        <!-- <td>
                            <a href="#showDetail"
                                [class]="selectedDetail==data.id?'ant-btn ant-btn-default ant-btn-icon-only active':'ant-btn ant-btn-default ant-btn-icon-only'"
                                nz-button nzType="default" (click)="showDetail(data.id)"><i nz-icon
                                    nzType="eye"></i></a>
                        </td> -->
                    </tr>
                </tbody>
            </nz-table>
            <div nz-row class="row_4" style="text-align: right;padding-top: 10px;">
                <nz-pagination [nzSize]="'small'" [(nzPageSize)]="pageSize" [(nzPageIndex)]="topIndex"
                    [nzTotal]="topTotalSize" [nzShowTotal]="topTotal" (nzPageIndexChange)="clickPageModal($event)">
                </nz-pagination>
                <ng-template #topTotal let-total> 总共 {{ topTotalSize }} 条 </ng-template>
            </div>
        </div>
        <div nz-row class="modal_table_2" id="showDetail">
            <nz-table [nzBordered]="true" nzTitle="出入库记录" #basicTableBottom [nzData]="modalTableDetail"
                [nzFrontPagination]="false" nzSize="small" >
                <thead>
                    <tr>
                        <th>条码批次</th>
                        <th>批次现有量</th>
                        <th>库存现有量</th>
                        <th>调整数</th>
                    </tr>
                </thead>
                <tbody>
                    <tr *ngFor="let data of basicTableBottom.data">
                        <td *ngIf="data.stockBatch!=''">{{ data.stockBatch }}</td>
                        <td *ngIf="data.stockBatch!=''">{{ data.batchNum }}</td>
                        <td *ngIf="data.stockBatch!=''">{{ data.stockNum }}</td>
                        <td *ngIf="data.stockBatch!=''">
                            <input nz-input [(ngModel)]="reserveNumModal" class="selecta" />
                        </td>
                    </tr>
                </tbody>
            </nz-table>
        </div>
    </div>
    <div nz-row class="footer_row">
        <button nz-button nzType="default" (click)="handleCancel()">取消</button>
        <button nz-button nzType="primary" (click)="addManyAdjust()">确认调整</button>
    </div>
</nz-modal>